<%--
  Created by IntelliJ IDEA.
  User: 苗苗
  Date: 2024/4/2
  Time: 10:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <link href="resource/css/style.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="resource/js/jquery.js"></script>
    <script src="resource/js/jquery-2.1.0.min.js"></script>
    <style>
        #qiandao, #already, #last, #back, #aback {
            width: 300px;
            height: 200px;
            color: whitesmoke;
            text-align: center;
            font-size: 100px;
            font-family: 华文行楷;
            margin: auto;
            margin-top: 90px;
            border-radius: 50%;
            line-height: 2;
            cursor: pointer;
            position: relative;

        }

        #qiandao:hover {
            color: blue;
        }

        #back:hover {
            color: blue;
        }

        body {
            background-image: url("resource/images/backgroundpeople.jpg");
            background-size: cover;
        }

        #p1 {
            margin: 0;
            font-size: 60px;
            color: white;
            text-align: center;
            margin-top: 40px;
        }
    </style>

    <script>
        $(function () {
            $("#qiandao").hide();
            $("#already").hide();
            $("#last").hide();
            $("#back").hide();
            $("#aback").hide();
            $.ajax({
                // 判断当前是否可以签到
                url: "/gettime",
                type: "post",
                success: function (data) {
                    if (data == 1) {
                        $("#qiandao").show()
                        $("#qiandao").click(function () {
                            $.ajax({
                                url: "signin",
                                type: "post",
                                data: {"result": 1},
                                success: function (data) {
                                    alert("签到成功")
                                    $("#already").show();
                                    $("#qiandao").hide()
                                }
                            })
                        })
                    } else if (data == 2) {
                        $("#qiandao").show()
                        $("#qiandao").click(function () {
                            $.ajax({
                                url: "signin",
                                type: "post",
                                data: {"result": 2},
                                success: function (data) {
                                    alert("签到成功")
                                    $("#already").show();
                                    $("#qiandao").hide()
                                }
                            })
                        })
                    } else if (data == 3) {
                        $("#back").show();
                        $("#back").click(function () {
                            $.ajax({
                                url: "signin",
                                type: "post",
                                data: {"result": 3},
                                success: function (data) {
                                    alert("签退成功")
                                    $("#aback").show();
                                    $("#back").hide()
                                }
                            })
                        })
                    }
                    if (data == 4) {
                        $("#already").show();
                    }
                    if (data == 5) {
                        $("#last").show();
                    }
                }
            })


        })

    </script>

</head>


<body>

<p id="p1"></p>

<script>
    var s = new Date();
    console.log(s);
    var p = document.getElementById("p1")
    setInterval(fun, 1000);

    function fun() {
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1
        var day = date.getDate()
        var house = date.getHours()
        var min = date.getMinutes()
        var sec = date.getSeconds()
        var week = date.getDay()
        var d = year + "年" + month + "月" + day + "日" + "周" + week + "   " + house + ":" + min + ":" + sec
        p.innerText = d;
    }
</script>

<div id="qiandao">
    签到!
</div>

<div id="already">
    已签到
</div>

<div id="last">
    不可签
</div>

<div id="back">
    签退
</div>

<div id="aback">
    已签退
</div>


</body>

</html>
